<style rel="stylesheet/scss" lang="scss">
  .prod-file {
    .el-tree-node__label {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .pds-form-item {
      display: inline-block;
      width: 33%;
    }

    .pds-form-textarea {
      width: 80%;
    }
    .col-25 {
      width: 25%;
    }
    .label-block {
      display: inline-block;
      width: 100%;
    }
    .ml-20 {
      margin-left: 10px;
    }
    .m-s-item {
      margin-bottom: 10px;
      .label {
        text-align: right;
        padding-right: 10px;
        padding-top: 8px;
      }
    }
    .basic-seach-top {
      margin: 0 !important;
      position: relative;
    }
    .dia-button {
      text-align: right;
      margin-top: 20px;
    }
    .search-btn {
      position: absolute;
      bottom: 10px;
      right: 10px;
    }
    .search-radio {
      padding-top: 12px;
    }
    .col-active {
      background: teal;
    }
    .sp {
      height: 36px;
      text-align: center;
      border: 1px solid #e8e8e8;
      line-height: 36px;
    }
    .right-fixed-len {
      overflow-x: scroll;
      white-space: nowrap;
    }
    .m-item {
      vertical-align: top;
      display: inline-block;
      min-width: 120px;
    }
    .sp-tit {
      background: #42b983;
      color: white;
    }
  }

  .future-add {
    text-align: right;
    margin-bottom: 10px;
    margin-top: -40px;
  }

  .bom-input-search {
    margin-top: -10px;
    margin-bottom: 10px;
    .input {
      display: inline-block;
      width: 200px;
    }
  }

  .add-bom-tit {
    background: #42b983;
    color: white;
    height: 40px;
    line-height: 40px;
    margin-top: 20px;
    padding-left: 10px;
  }
</style>
<template>
  <div class="prod-file">
    <!-- 产品档案 -->
    <custom-card title="产品档案" style="margin-top:20px">
      <custom-card title="模组配置">
        <el-collapse @change="handleChange">
          <el-collapse-item :title="language=='en'?form.itemNameEn:form.itemNameCn"
                            :name="index"
                            v-if="data.showModules.length"
                            v-for="(form,index) in data.showModules"
                            :key="index">
            <template slot="title">
              {{language=='en'?form.itemNameEn:form.itemNameCn}}
              <el-button size="small" type="primary" plain class="ml-20" @click.stop="chooseModule(index)"
                         v-if="form.paramsList&&form.paramsList.length&&page!='detail'">选择型号
              </el-button>
            </template>
            <el-form :model="form.formData" :rules="form.formRules" :ref="'mform'+index" label-width="140px"
                     v-show="form.paramsList&&form.paramsList.length">
              <el-form-item :label="language=='en'?item.paramNameEn:item.paramNameCn+'：'" :prop="item.id"
                            v-for="(item,index) in form.paramsList" :label-width="item.labelWidth||'140px'"
                            class="pds-form-item"
                            :key="index"
                            :class="{'pds-form-textarea':item.element=='textarea'||item.element=='upload'||item.element=='input'&&item.col==100||item.element=='checkbox'||item.element=='label-block'||item.col==100,'col-25':item.col==25}">
                <el-input v-model="form.formData[item.id]" v-if="item.element=='input'"
                          :placeholder="item.paramPromptWord" :type="item.type"
                          :disabled="page=='detail'&&item.paramKey==1">
                  <template slot="append" v-if="item.paramUnitDv">{{item.paramUnitDv}}</template>
                </el-input>
                <el-input v-model="form.formData[item.id]" v-if="item.element=='range'"
                          :placeholder="item.paramPromptWord" :type="item.type"
                          :disabled="page=='detail'&&item.paramKey==1" style="width:20%"></el-input>
                <span v-if="item.element=='range'" type="number">~</span>
                <el-input v-model="form.formData[item.id+'m']" type="number" v-if="item.element=='range'"
                          :placeholder="item.paramPromptWord" :type="item.type"
                          :disabled="page=='detail'&&item.paramKey==1" style="width:70%">
                  <template slot="append" v-if="item.paramUnitDv">{{item.paramUnitDv}}</template>
                </el-input>
                <!-- <el-input type="textarea" v-model="form.formData[item.id]" v-if="item.element=='textarea'" :placeholder="item.paramPromptWord"></el-input>
                  <el-date-picker v-model="form.formData[item.id]" placeholder="请选择" style="width:100%" v-if="item.element=='datePicker'&&item.type=='year'" :type="item.type" value-format="yyyy">
                  </el-date-picker>
                  <el-date-picker v-model="form.formData[item.id]" placeholder="请选择" style="width:100%" v-if="item.element=='datePicker'&&item.type!='year'" :type="item.type" value-format="yyyy-mm-dd">
                  </el-date-picker> -->
                <el-radio-group v-model="form.formData[item.id]" v-if="item.element=='radio'"
                                :disabled="page=='detail'&&item.paramKey==1">
                  <el-radio
                    v-for="option in [{id:0,labelEnUs:'N',labelZhCh:'否',value:'0'},{id:1,labelEnUs:'Y',labelZhCh:'是',value:'1'}]"
                    :key="option.id" :label="option.value">{{language=='en'?option.labelEnUs:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
            </el-form>
          </el-collapse-item>
        </el-collapse>
      </custom-card>
    </custom-card>
    <el-dialog title="模组型号选择" width="70%" :visible.sync="showDialog"
               v-if="moduleSearch.paramsList&&moduleSearch.paramsList.length">
      <!-- <el-dialog title="模组型号选择" width="80%" visible=""> -->
      <custom-card title="基本信息">
        <template>
          <div class="pds-tip-green basic-seach-top" :style="{height:calModuleDiaTop+'px'}">
            <p>
              <!-- <el-col :span="12" v-for="params in moduleSearch.paramsList" class="m-s-item" v-if="params.paramKey"> -->
              <el-col :span="12" v-for="params in moduleSearch.paramsList" class="m-s-item">
                <el-col :span="8" class="label">
                  {{language=='en'?params.paramNameEn:params.paramNameCn}}：
                </el-col>
                <el-col :span="16">
                  <el-input v-if="params.paramTypeDv!='radio'" v-model="params.paramValue"></el-input>
                  <el-radio-group v-if="params.paramTypeDv=='radio'" v-model="params.paramValue" class="search-radio">
                    <el-radio
                      v-for="option in [{id:0,labelEnUs:'N',labelZhCh:'否',value:'0'},{id:1,labelEnUs:'Y',labelZhCh:'是',value:'1'}]"
                      :key="option.id" :label="option.value">{{language=='en'?option.labelEnUs:option.labelZhCh}}
                    </el-radio>
                  </el-radio-group>
                </el-col>
              </el-col>
            </p>
            <el-button type="success" size="small" @click="searchMaterial()" class="search-btn">搜索</el-button>
          </div>
          <div class="search-result" v-if="moduleSearch.paramsList&&materailsList.length">
            <el-row>
              <el-col :span="6">
                <div class="sp-tit sp">模组参数</div>
                <div v-for="(item,index) in moduleSearch.paramsList" :key="index" class="sp">
                  {{language=='en'?item.paramNameEn:item.paramNameCn}}
                </div>
              </el-col>
              <el-col :span="18">
                <div class="right-fixed-len" :style="{height:36*(moduleSearch.paramsList.length+1.5)+'px'}">
                  <div v-for="(item,index) in materailsList" :key="index" class="m-item"
                       :style="{width:100/materailsList.length+'%'}">
                    <div class="sp-tit sp" @click="chooseMaterial(index)">{{item.plmMaterielName}}</div>
                    <div v-for="(paramItem,paramIdx) in moduleSearch.paramsList" :key="paramIdx" class="sp"
                         :class="{'col-active':index==moduleSearch.materialIndex}">
                      {{showMaterialParamValue(paramItem.id,item)}}
                    </div>
                  </div>
                </div>
              </el-col>
            </el-row>
            <!-- <el-table :data="moduleSearch.paramsList" max-height="400" style="width: 100%" @header-click="chooseMaterial" border>
              <el-table-column fixed label="模组参数" width="150" align="center">
                <template slot-scope="scope">
                  {{language=='en'?scope.row.paramNameEn:scope.row.paramNameCn}}
                </template>
      </el-table-column>
      <el-table-column :label="item.plmMaterielName" width="150" v-for="(item,index) in materailsList" :key="index" align="center" class-name="col-active">
        <template slot-scope="scope">
                  {{showMaterialParamValue(scope.row.id,item)}}
                </template>
      </el-table-column>
      </el-table> -->
          </div>
        </template>
      </custom-card>
      <div class="dia-button">
        <el-button type="" size="small" @click="showDialog=false">取消</el-button>
        <el-button type="primary" size="small" @click="setModuleItemValue()">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="模组BOM料件配置" width="70%" :visible.sync="showDialogBom">
      <div class="bom-input-search">
        查询条件
        <el-input placeholder="请输入料件编号或名称" v-model="bom.key" class="input"></el-input>
        <el-button type="success" size="small" @click="searchBom()">查询</el-button>
        <el-button type="primary" size="small" @click="addTempBomItem()">新建临时料件</el-button>
      </div>
      <el-table :data="bom.searchList" border style="width: 100%">
        <el-table-column fixed="left" label="序号" width="60px" type="index" align="center">
          <template slot-scope="scope">
            {{scope.$index+1}}
          </template>
        </el-table-column>
        <el-table-column label="料号" align="center">
        </el-table-column>
        <el-table-column label="品名" align="center">
        </el-table-column>
        <el-table-column label="规格" align="center">
        </el-table-column>
        <el-table-column label="单位" align="center">
        </el-table-column>
        <el-table-column label="数量" align="center">
        </el-table-column>
        <el-table-column label="图片" align="center">
        </el-table-column>
        <el-table-column label="属性" align="center">
        </el-table-column>
        <el-table-column label="产品克重" align="center">
        </el-table-column>
        <el-table-column label="模穴数" align="center">
        </el-table-column>
        <el-table-column label="机台吨位" align="center">
        </el-table-column>
        <el-table-column label="出模周期" align="center">
        </el-table-column>
        <el-table-column label="单价" align="center">
        </el-table-column>
        <el-table-column label="币种" align="center">
        </el-table-column>
        <el-table-column label="说明" align="center">
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="130px" align="center">
          <template slot-scope="scope">
            <el-button class="filter-item" type="primary" size="mini" @click="addBomItem(scope.row)">添加到清单</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="add-bom-tit">
        模组BOM料件清单
      </div>
      <el-table :data="bom.bomList" border style="width: 100%">
        <el-table-column fixed="left" label="序号" width="60px" type="index" align="center">
          <template slot-scope="scope">
            {{scope.$index+1}}
          </template>
        </el-table-column>
        <el-table-column label="料号" align="center">
          <template slot-scope="scope">
            <el-input type="" v-model="scope.row.materialNo"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="品名" align="center">
          <template slot-scope="scope">
            <el-input type="" v-model="scope.row.materialName"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="规格" align="center">
          <template slot-scope="scope">
            <el-input type="" v-model="scope.row.materialSize"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="单位" align="center">
          <template slot-scope="scope">
            <el-input type="" v-model="scope.row.materialUnit"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="数量" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="图片" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="属性" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="产品克重" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="模穴数" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="机台吨位" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="出模周期" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="说明" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="单价" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column label="币种" align="center">
          <template slot-scope="scope">
            <el-input type="number" v-model="scope.row.amount"></el-input>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="130px" align="center">
          <template slot-scope="scope">
            <el-button class="filter-item" type="danger" size="mini" @click="delBomItem(scope.$index)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="dia-button">
        <el-button type="" size="small" @click="showDialogBom=false">取消</el-button>
        <el-button type="primary" size="small" @click="bomConfigConfirm()">确定</el-button>
      </div>
    </el-dialog>
    <el-dialog :visible.sync="showTempBomForm">
    <!-- 基本属性 -->
    <custom-card title="基本信息" class="mt-30">
      <el-form  label-width="140px" :inline="true" class="filter">
        <el-form-item label="料号:">
          <el-input v-model="editForm.name" placeholder="请输入简称" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="品名:">
          <el-input v-model="editForm.companyName" placeholder="请输入全称" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="规格:">
          <el-input v-model="editForm.companyAddress" placeholder="请输入地址" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="单位:">
          <el-input v-model="editForm.name" placeholder="请输入简称" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="数量:">
          <el-input v-model="editForm.companyName" placeholder="请输入全称" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="属性:">
          <el-input v-model="editForm.companyName" placeholder="请输入全称" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="产品克重:">
          <el-input v-model="editForm.companyName" placeholder="请输入全称" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="模穴数:">
          <el-input v-model="editForm.companyAddress" placeholder="请输入地址" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="机台吨位:">
          <el-input v-model="editForm.companyAddress" placeholder="请输入地址" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="出模周期:">
          <el-input v-model="editForm.companyAddress" placeholder="请输入地址" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="说明:">
          <el-input v-model="editForm.companyAddress" placeholder="请输入地址" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="单价:">
          <el-input v-model="editForm.companyAddress" placeholder="请输入地址" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="币种:">
          <el-input v-model="editForm.companyAddress" placeholder="请输入地址" width="200px"></el-input>
        </el-form-item>
        <el-form-item label="图片:">
          <el-input v-model="editForm.companyName" placeholder="请输入全称" width="200px"></el-input>
        </el-form-item>
      </el-form>
    </custom-card>
            <span slot="footer" class="dialog-footer">
        <el-button @click="showTempBomForm = false">取 消</el-button>
        <el-button type="primary" @click="submitTempBom()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>


<script>
  import {mapGetters} from 'vuex';
  import * as prodApi from '@/api/product/index';
  import CustomCard from '@/components/CustomCard/index';

  export default {
    name: 'ProdFile',
    components: {
       CustomCard
    },
    props: {
      page: {
        type: String,
        default: null
      },
      categoryArray: {
        type: Array,
        default() {
          return [];
        }
      },
      standard: {
        type: Number,
        default: 1
      }
    },
    watch: {
      'data.asset'(val) {
        this.$refs.treeAsset && this.$refs.treeAsset.filter(val);
      },
      'data.future'(val) {
        this.$refs.treeFuture && this.$refs.treeFuture.filter(val);
      },
      standard(val) {
        console.log('watch standard', this.categoryId)
        this.getPdsConfModule(this.categoryId);
      }
    },
    computed: {
      ...mapGetters(['elements', 'language']),
      // 计算搜索物料顶部高度
      calModuleDiaTop() {
        if (this.moduleSearch && this.moduleSearch.paramsList.length) {
          const result = this.moduleSearch.paramsList.filter(
            item => item.paramKey == 1
          );
          const len = Math.ceil(result.length / 2);
          return (len + 2) * 36;
        }
      },

      // 计算物料单元格显示
      showMaterialParamValue() {
        return (paramsId, materailItem) => {
          let result = materailItem.materielParams.filter(
            val => val.id === Number(paramsId)
          );
          if (result.length) {
            result = result[0];
            if (result.paramTypeDv === 'radio') {
              if (result.paramValue == 1) {
                return this.language == 'en' ? 'Y' : '是';
              } else {
                return this.language == 'en' ? 'N' : '否';
              }
            } else if (result.paramTypeDv === 'range') {
              return `${result.paramValue}～${result.paramMaxValue}${
                result.paramUnitDv
                }`;
            } else {
              return result.paramValue + result.paramUnitDv;
            }
          } else {
            return '';
          }
        };
      }
    },
    data() {
      return {
        // 搜索物料清单
        materailsList: [],
        editForm: {},
        // 显示搜索物料对话框
        showDialog: false,
        showDialogBom: false,
        showTempBomForm: false,
        bom: {
          searchList: [],
          bomList: []
        },
        // 选中模组搜索物料对象
        moduleSearch: {
          paramsList: []
        },
        // 业务页面传递数据
        data: {}
      };
    },
    created() {
      this.dataInit();
    },
    methods: {
      dataInit() {
        const data = {
          assetTreeList: [],
          showAccessoriesList: [],
          futureTreeList: [],
          showFeaturesList: [],
          asset: '',
          future: '',
          showModules: [],
          module: {}
        };
        this.data = JSON.parse(JSON.stringify(data));
      },

      // 业务页面获取数据后回显数据--->业务页面调用方法
      refresh(detail) {
        console.log('')
        this.data.showAccessoriesList = detail.showAccessoriesList;
        this.data.showFeaturesList = detail.showFeaturesList;
        this.data.showModules = detail.showModules;
        console.log('asdasdadsa', detail.showModules)
        // detail.showModules.forEach(item => {
        //   item.paramsList.forEach(child => child.paramValue = child.paramValue || '1');
        // });
        // detail.showModules = detail.showModules || [];
        console.log('detail', detail);
        // this.data.showModules = [];
        if (detail.pdsConfCategoryArray && detail.pdsConfCategoryArray.length === 3) {
          this.prodCategoryChanged(detail.pdsConfCategoryArray[2], 'copyModule');
        }
        let formArr = [];
        if(detail.showModules){
        detail.showModules.map((moduleItem, odx) => {
          const formRules = {};
          const formData = {};
          if (moduleItem.paramsList.length) {
            // moduleItem.paramsList.forEach(item => {
            //   item.paramValue = item.paramValue ? item.paramValue : '';
            //   item.paramMaxValue = item.paramMaxValue ? item.paramMaxValue : '';
            // });
            moduleItem.paramsList.map(paramsItem => {
              this.setParamsToForm(paramsItem, moduleItem, formRules, formData, odx);
            });
            console.log('formData', formData);
            const module = {
              formRules,
              formData,
              paramsList: moduleItem.paramsList,
              id: moduleItem.id,
              idx: moduleItem.idx,
              itemNameCn: moduleItem.itemNameCn,
              itemNameEn: moduleItem.itemNameEn,
              moduleId: moduleItem.moduleId,
              itemCode: moduleItem.itemCode
            };
            formArr.push(module);
            // this.data.showModules.push(this.data.module);
          }
        });
        }

        this.data.showModules = formArr;
        this.$set(this.data, 'showModules', formArr);
        // console.log('showModules', this.data.showModules);
      },

      // 产品小类变化时--->业务页面调用方法
      prodCategoryChanged(categoryId, type) {
        this.categoryId = categoryId
        // TODO 为什么type != copyModule时不获取模组配置
        if (type !== 'copyModule') {
          this.getPdsConfModule(categoryId);
        }
        this.getPdsConfAssetTree(categoryId);
        this.getPdsConfFutureTree(categoryId);
      },

      // 父组件提交进行表单验证--->业务页面调用方法
      submitForm() {
        let isAllValid = 0;
        let formLen = 0;
        const checkResult = () => {
          this.data.showModules.forEach((value, index) => {
            if (value.paramsList && value.paramsList.length) {
              const formName = 'mform' + index;
              formLen++;
              this.$refs[formName][0].validate(valid => {
                if (valid) {
                  isAllValid++;
                  console.log('isAllValid', index);
                } else {
                  console.log('prodfile submit-error!!', index);
                }
              });
            } else {
              // this.$message.error('请输入型号')

              this.getPdsConfModulePrams(value.id, index);
            }
          });
        };
        checkResult();
        return new Promise((resolve, reject) => {
          const result = {
            isValid: isAllValid === formLen,
            data: this.data
          };
          resolve(result);
        });
      },
      // =========================================业务页面调用方法结束
      // 获取附件树
      getPdsConfAssetTree(productCategoryId) {
        prodApi
          .getPdsConfAssetTree({
            type: 2,
            productCategoryId
          })
          .then(res => {
            this.data.assetTreeList = res.data;
          });
      },
      addFuture() {
        this.data.showFeaturesList.push({});
      },
      // 获取特征树
      getPdsConfFutureTree(productCategoryId) {
        prodApi
          .getPdsConfAssetTree({
            type: '3',
            productCategoryId
          })
          .then(res => {
            this.data.futureTreeList = res.data;
          });
      },
      // 是否是新增附件选项
      handleTreeClick(data) {
        let isNew = true;
        this.data.showAccessoriesList.map(row => {
          if (row.assetId === data.id) {
            isNew = false;
          }
          // return row
        });
        if (isNew) {
          data.assetId = data.id;
          data.accessoryQuantity = 1;
          this.data.showAccessoriesList.push(data);
        }
      },
      // 是否是新增特征选项
      handleFutureClick(data) {
        let isNew = true;
        this.data.showFeaturesList.map(row => {
          if (row.assetId === data.id) {
            isNew = false;
          }
        });
        if (isNew) {
          data.assetId = data.id;
          this.data.showFeaturesList.push(data);
        }
      },
      // 删除特征或者附件
      deletItem(index, list) {
        list.splice(index, 1);
      },
      // 筛选附件
      filterAsset(value, data) {
        if (!value) return true;
        if (this.language === 'en') {
          return data.nameEn.indexOf(value) !== -1;
        } else {
          return data.nameCn.indexOf(value) !== -1;
        }
      },
      // 筛选特征
      filterFuture(value, data) {
        if (!value) return true;
        if (this.language === 'en') {
          return data.nameEn.indexOf(value) !== -1;
        } else {
          return data.nameCn.indexOf(value) !== -1;
        }
      },
      // ===================================模组相关方法开始
      // 根据产品小类获取模组ModuleItem
      getPdsConfModule(categoryId) {
        // debugger
        if (!categoryId) {
          return
        }
        prodApi
          .pdsConfModule({
            categoryId,
            standard: this.standard
          })
          .then(res => {
            if (res.code == 200) {
              this.data.showModules = res.data;
            } else {
              this.$message.error(res.message);
            }
          });
      },
      // 获取模组参数ParamItem
      getPdsConfModulePrams(itemId, idx) {
        prodApi.pdsConfModulePrams({itemId}).then(res => {
          const formData = {};
          const formRules = {};
          res.data.map(row => this.setParamsToForm(row, this.data.showModules[idx], formRules, formData, idx))
          this.$set(this.data.showModules[idx], 'formRules', formRules);
          this.$set(this.data.showModules[idx], 'formData', formData);
          this.$set(this.data.showModules[idx], 'paramsList', res.data);
        });
      },
      // 在没有导入其他数据时，逐条获取模组参数
      handleChange(val) {
        val.map(row => {
          if (!this.data.showModules[row].paramsList) {
            this.getPdsConfModulePrams(this.data.showModules[row].id, row);
          }
          console.log(val);
        });
      },
      // 设置模组表单
      setParamsToForm(paramsItem, moduleItem, formRules, formData, odx) {
        paramsItem.id = paramsItem.id.toString();
        const attrName = paramsItem.id;
        // 设置表单渲染元素
        const setFormElement = paramsItem => {
          let element, type;
          switch (paramsItem.paramTypeDv) {
            case 'checkbox':
              // element = 'checkbox'
              element = 'input';
              break;
            case 'combo':
              element = 'input';
              // element = 'select'
              break;
            case 'datetime':
              element = 'datePicker';
              type = 'date';
              break;
            case 'date_range':
              element = 'datePicker';
              type = 'daterange';
              break;
            case 'double':
              element = 'input';
              type = 'number';
              break;
            case 'int':
              element = 'input';
              type = 'number';
              break;
            case 'multiple_combo':
              element = 'input';
              // element = 'select'
              type = 'multiple';
              break;
            case 'picture':
              element = 'upload';
              break;
            case 'radio':
              element = 'radio';
              break;
            case 'text':
              element = 'input';
              break;
            case 'textarea':
              element = 'input';
              break;
            case 'range':
              element = 'range';
              break;
            default:
          }
          paramsItem.element = element || 'input';
          paramsItem.type = type;
        };
        // 设置验证规则
        const setFormRules = paramsItem => {
          formRules[attrName] = {
            required: paramsItem.paramRequired == 1,
            message: paramsItem.paramNameCn + 'is required',
            trigger: 'blur'
          };
        };
        // 设置表单数据
        const setFormData = paramsItem => {
          formData[attrName] = paramsItem.paramValue;
          formData[attrName + 'm'] = paramsItem.paramMaxValue;
        };

        setFormElement(paramsItem);
        setFormData(paramsItem);
        setFormRules(paramsItem);
        // debugger
      },
      // 打开某个模组Item选择物料对话
      chooseModule(index) {
        this.moduleSearch = this.data.showModules[index];
        this.moduleSearch.moduleItemIdx = index;
        this.materailsList = [];
        this.showDialog = true;
        debugger
      },
      // 根据关键参数搜索物料
      searchMaterial() {
        console.log(this.moduleSearch)
        this.moduleSearch.itemId = this.moduleSearch.id;
        this.moduleSearch.standard = this.standard;
        this.moduleSearch.params = [];
        this.moduleSearch.params
        this.moduleSearch.paramsList.map(row => {
          if (row.paramKey == 1) {
            row.paramId = row.id;
            this.moduleSearch.params.push(row);
          }
        });
        const params = {
          constraintItemIds: '',
          idx: 2,
          itemId: 41,
          modulId: 21,
          params: [{
            paramId: 89,
            paramMaxValue: '0',
            paramTypeDv: 'text',
            paramValue: '1',
            standard: 0
          }],
          standard: 0
        };
        // params为测试数据，实际情况为 this.moduleSearch
        prodApi.searchMaterial(this.moduleSearch).then(res => {
          if (res.code === 200) {
            // this.materailsList.push(res.data[0]);// 测试数据-del
            // this.materailsList.push(res.data[0]);// 测试数据-del
            // this.materailsList.push(res.data[0]);// 测试数据-del
            // this.materailsList.push(res.data[0]);// 测试数据-del
            // this.materailsList.push(res.data[0]);// 测试数据-del
            // this.materailsList.push(res.data[0]);// 测试数据-del
            // this.materailsList[0].materielParams[0].id = 81; // 测试数据-del
            // this.materailsList[0].materielParams[1].id = 82; // 测试数据-del
            this.materailsList = res.data;
            // if (res.data.length == 0) {
            //   this.$message.info('未搜到相关结果！')
            // }
          } else {
            this.$message.error(res.message);
          }
        });
      },
      // 选择物料进行模组数据填充
      chooseMaterial(column) {
        this.$set(this.moduleSearch, 'materialIndex', column);
      },
      // 选择物料后确认
      setModuleItemValue() {
        const materialIndex = this.moduleSearch.materialIndex;
        const moduleItemIdx = this.moduleSearch.moduleItemIdx;
        if (materialIndex >= 0) {
          this.materailsList[materialIndex].materielParams.map(item => {
            this.data.showModules[moduleItemIdx].formData[item.id] =
              item.paramValue;
            if (item.paramTypeDv === 'range') {
              this.data.showModules[moduleItemIdx].formData[item.id + 'm'] =
                item.paramMaxValue;
            }
          });
          this.showDialog = false;
        } else {
          this.$message.error('请选择物料！');
        }
      },
      // 打开配置BOM对话框
      configBom() {
        this.showDialogBom = true;
      },
      // 配置BOM对话框-搜索
      searchBom() {
        this.bom.searchList.push({});
      },
      // 配置BOM对话框-新建临时料件
      addBomItem(item) {
        item = item || {}
        this.bom.bomList.push(item)
      },
      // 新增临时料件
      submitTempBom() {
        this.showTempBomForm = false;
        this.bom.bomList.push(this.editForm)
      },
      //新建临时料件
      addTempBomItem() {
        this.showTempBomForm = true
      },
      delBomItem(index) {
        this.bom.bomList.splice(index, 1)
      },
      bomConfigConfirm() {
        this.showDialogBom = false
      }
    }
  };
</script>
